﻿<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="CustomTreeControl.ascx.cs"
    Inherits="Basic4Net.OAWeb.CustomControl.CustomTreeControl" %>
<script language="javascript" src="<%=Page.ResolveClientUrl("~/Scripts/xTree/dhtmlxcommon.js")%>"></script>
<script language="javascript" src="<%=Page.ResolveClientUrl("~/Scripts/xTree/dhtmlxtree.js")%>"></script>
<link rel="stylesheet" href="<%=Page.ResolveClientUrl("~/App_Themes/ui-lightness/dhtmlxtree.css")%>"
    type="text/css" />
<link rel="stylesheet" href="<%=Page.ResolveClientUrl("~/App_Themes/ui-lightness/main.css")%>"
    type="text/css" />
<script language="javascript" src="<%=Page.ResolveClientUrl("~/Scripts/jquery-1.4.1.js")%>"></script>
<script language="javascript" src="<%=Page.ResolveClientUrl("~/Scripts/jquery-ui-1.8.2.js")%>"></script>
<script language="javascript" src="<%=Page.ResolveClientUrl("~/Scripts/jquery.validate.js")%>"></script>
<script language="javascript" src="<%=Page.ResolveClientUrl("~/Scripts/Common.js")%>"></script>
<script type="text/javascript">

	$(function(){
		initTree();
	});

	var tree = null;

	var handlerUrl = '<%= Page.ResolveClientUrl("~/CustomControl/TreeHandler.ashx") %>';
	function initTree() {
		tree = new dhtmlXTreeObject('tree', '100%', '100%', 0);
		tree.setImagePath('<%= Page.ResolveClientUrl("~/App_Themes/ui-lightness/xTreeImgs/csh_vista/") %>');
		tree.setOnOpenHandler(tree_OnOpen);
		tree.setOnClickHandler(tree_OnClick);
		tree.setOnDblClickHandler(tree_OnDblClick);
		tree.setOnRightClickHandler(tree_OnRightClick);
		initRoot();
	}

	function initRoot() {
		$.getJSON(handlerUrl, { Type: "root", TypeID: <%= TreeType %> }, function (data) {
			for (var i = 0; i < data.length; i++) {
				var folder = data[i];
				var img1, img3 = "folderClosed.gif";
				var img2 = "folderOpen.gif";

				var treeId = folder.FolderID;
				tree.insertNewChild(0, treeId, folder.FolderName, 0, img1, img2, img3);
				tree.setUserData(treeId, "collapse", "false");

                tree.setUserData(treeId, "name", folder.FolderName);


				tree.setUserData(treeId, "collapseState", "false");
				var loadingID = 0 - treeId;
				tree.setUserData(treeId, "ChildID", loadingID);
				tree.insertNewChild(treeId, loadingID, "loading...", 0, "", "", "");
			}
			tree.closeAllItems(0);
		});
	}

    function initChildTree(id) {
        var childID = tree.getUserData(id, "ChildID");
        tree.setUserData(id, "collapse", "true");
        tree.deleteItem(childID, false);
        var folderId = parseInt(id);
        folderId = folderId < 0 ? 0 - folderId : folderId;

		
        var treeId;
		$.getJSON(handlerUrl, { Type: "folder", TypeID: folderId }, function (data) {
            for (var i=0; i<data.length; i++) {
                var folder = data[i];
				
				var img1, img3 = "folderClosed.gif";
				var img2 = "folderOpen.gif";

                treeId = folder.FolderID;
                tree.insertNewChild(folderId, treeId, folder.FolderName, 0, img1, img2, img3); 
                tree.setUserData(treeId, "collapse", "false");

                tree.setUserData(treeId, "name", folder.FolderName);

				var loadingID = 0 - treeId;
                tree.setUserData(treeId, "ChildID", loadingID);                
                tree.insertNewChild(treeId, loadingID, "loading...", 0, "", "", ""); 
                            
                tree.closeAllItems(treeId);
            }
            //tree.closeItem(treeId);
		});
        //tree.closeItem(treeId);
    }

	function tree_OnOpen(id, mode) {
		var state = mode > 0 ? "close" : "open";
		var collapse = tree.getUserData(id, "collapse");
		if (state == "open" && collapse == "false") {
			initChildTree(id)
		}
		if (state == "close") {
			tree.closeAllItems(id);
		}
		if (state == "open") {
			tree.openAllItems(id);
		}
	}

	function tree_OnDblClick(id) {
		var state = tree.getUserData(id, "collapseState") == "true" ? "close" : "open";
		var collapse = tree.getUserData(id, "collapse");
		if (state == "open" && collapse == "false") {
			tree.setUserData(id, "collapseState", "true");
			initChildTree(id);
		}
		if (state == "open") {
			tree.setUserData(id, "collapseState", "true");
			tree.openAllItems(id);
		}
		if (state == "close") {
			tree.setUserData(id, "collapseState", "false");
			tree.closeAllItems(id);
		}
	}

	function tree_OnClick(nodeId) {

		if (nodeId < 0) {
			tree.selectItem(nodeId, false);
			return;
		}
		if (nodeId.toString().indexOf("_") > 0) nodeId = nodeId.substr(0, nodeId.indexOf("_"));
		var url = 'Content.aspx?FolderID='+nodeId;
		leftNav(url);
        
        SelectedNodeID = nodeId;
        SelectedNodeName = tree.getUserData(nodeId, "name");

	}

	function leftNav(url) {
		parent.frames["mainFrame"].location = url;
	}

	function tree_OnRightClick(id,e) {		
		var oPopup=window.createPopup();  
		var oPopBody=oPopup.document.body;

	}

    function Add()
    {
        window.parent.ShowAddDiv();
    }

    function Delete()
    {
        window.parent.DeleteFolder();
    }

    function Update()
    {
        window.parent.ShowUpdateDiv(SelectedNodeName)
    }

    var SelectedNodeID;
    var SelectedNodeName;

    function InsertTreeNode(nodeName)
    {
    	var img1, img3 = "folderClosed.gif";
		var img2 = "folderOpen.gif";
        tree.insertNewChild(SelectedNodeID, 8, nodeName, 0, img1, img2, img3); 
    }

    function DeleteTreeNode()
    {
        tree.deleteItem(SelectedNodeID, false); 
        leftNav("about:blank");
    }

    function UpdateTreeNode(nodename)
    {
        tree.setItemText(tree.getSelectedItemId(),nodename);
    }

</script>
<div id="operation" style="width: 100%;">
    <table style="width: 80%; border-bottom: 1px">
        <tr>
            <td style="width: 33%; text-align: center; font-size: 13px;">
                <a href="#" onclick="Add();">
                    <img alt="" src="<%=Page.ResolveClientUrl("~/App_Themes/ui-lightness/ProjectImages/add.png")%>" />新建</a>
            </td>
            <td style="width: 33%; text-align: center; font-size: 13px;">
                <a href="#" onclick="Delete();">
                    <img alt="" src="<%=Page.ResolveClientUrl("~/App_Themes/ui-lightness/ProjectImages/del.png")%>" />删除</a>
            </td>
            <td style="width: 33%; text-align: center; font-size: 13px;">
                <a href="#" onclick="Update();">
                    <img alt="" src="<%=Page.ResolveClientUrl("~/App_Themes/ui-lightness/ProjectImages/edit.png")%>" />修改</a>
            </td>
        </tr>
    </table>
    <br />
</div>
<div id="tree" style="width: 100%;">
</div>
